<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">      
    <title>163网易免费邮-你的专业电子邮箱</title>
    <style>
        body{background-color:#9999ff54;}
        a{text-decoration:none;}
        .top3-box{position: absolute;left: 1500px;top: 0px;}
        .footer-box{position: absolute;left: 750px;top: 1100px;}
        .right-box{position: absolute;left: 1350px;top: 400px;}
        .top1-box{position: absolute;left:50px;top: 50px;}
        .top2-box{position: absolute;left:250px;top: 60px;}
        .minddle-box{position: absolute;left:200px;top: 300px;}
        div{
            width: 800px;
            height: 600px;
        }
        img2{
            width: 100%;
            height: 100%;
        }
        .div1{
            position: absolute;left:200px;top: 300px;
        }
        .div2{
            position: absolute;left:200px;top: 300px;
        }
    </style>
    </style>
</head>

<body>
<div class="top1-box">
    <img src="./图片/图片1.png" alt=""></div>
<div class="top2-box">
    &nbsp;|&nbsp;你的专业电子邮箱
</div>
<div class="top3-box">   
    <a href="file:///E:/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1vcode/VsCode%E4%BB%93%E5%BA%93/0922/web/homework.html/%E7%BD%91%E6%98%93%E9%82%AE%E7%AE%B1%E7%B3%BB%E7%BB%9F_%E5%85%8D%E8%B4%B9%E4%B8%8B%E8%BD%BD.html">手机App下载&nbsp;电脑客户端下载&nbsp;Vip&nbsp;会员&nbsp;企业邮箱&nbsp;帮助&nbsp;反馈&nbsp;修复公示</a>
</div>
<div class="minddle-box">
</div>
<div class="right-box"
    <span><b><font size="6">账号登录</font></b></span>
        <form action="">
            <table>
                <tr>
                    <td><input type="text">@163.com</td> 
                </tr>
                <tr>
                    <td><input type="password"></td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="int">30天内免登录</td>
                </tr>
                <tr>
                    <td>
                        <font size="5"><b><a href='https://mail.163.com/js6/main.jsp?sid=XDvMeZUioaqdwvXYEDiikliXlWwZVwSi&df=mail163_letter#module=welcome.WelcomeModule%7C%7B%7D'>登录</a></b></font>
                    </td>
                </tr>
                <tr>
                    <td><a href="">忘记密码&nbsp;注册新账号</a></td>
                </tr>
            </table>
        </form>
</div>
<div class="footer-box">
    <a href="file:///E:/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1vcode/VsCode%E4%BB%93%E5%BA%93/0922/web/homework.html/%E7%BD%91%E6%98%93%E9%82%AE%E7%AE%B1%E7%B3%BB%E7%BB%9F_%E7%BD%91%E6%98%93%E9%A6%96%E9%A1%B5.html">网易首页&nbsp;|&nbsp;网易严选&nbsp;|&nbsp;政府公益热线&nbsp;|&nbsp;隐私政策&nbsp;|&nbsp;儿童隐私政策&nbsp;|&nbsp;网易公司版权所有©1997-2022</a>
</div>

<span id="text"></span>

    <div class="div1">
        <img id="img" alt="">
    </div>
    <div class="div2">
        <button id="pret"><font size="3"><b>上一张</b></font></button>
        <button id="next"><font size="3"><b>下一张</b></font></button>
    </div>

</body>

<script>
    let imgArr=["./图片/图片44.png","./图片/图片22.png","./图片/图片33.png","./图片/图片11.png","./图片/图片44.png","./图片/图片22.png","./图片/图片33.png","./图片/图片33.png","./图片/图片11.png"
    ]

    let img=document.getElementById("img");
    let pret=document.getElementById("pret");
    let next=document.getElementById("next");
    let text=document.getElementById("text");
    var i=0;
    defaultImg(imgArr, img, i, text);
    next.addEventListener("click", () => {
        nextFn(imgArr, img)
    })
    pret.addEventListener("click", () => {
        prext(imgArr, img)
    })
    function defaultImg(arr, img, index, text) {
        img.src=arr[index];
        text.innerText=''
    }function prextFn(arr) {
        if (i==0){
            i=arr.length - 1;
            img.src=arr[arr,length -1];
            text.innerText=''
            alert("")
            return
        }
        i--;
        img.src=imgArr[i];
        text.innerText=''
    }
    function nextFn(arr) {
        if (i == arr.length -1) {
            i=0;
            img.src=arr[0];
            text.innerText=''
            alert("很抱歉，设计师水平有限")
            return
        }
        i++;
        img.src=arr[i];
        text.innerText=''
    }
</script>
</html>